<!doctype html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout"
      layout:decorator="base"
      th:with="pageTitle='详情'" xmlns:v-on="http://www.w3.org/1999/xhtml">
<head>
    <link rel="stylesheet" th:href="@{/css/index.css}">
    <style>
        .search-form {
            background-color: #fff;
            padding: 10px;
            line-height: 50px;
            height: 50px;
            /*margin: 15px 0;*/
            vertical-align: middle;
            text-align: left;
            width: 98%;
        }

        .info-form {
            background-color: #fff;
            padding: 10px;
            padding-left: 30px;
            line-height: 50px;
            /*line-height: 50px;*/
            margin: 25px 0;
            height: 50px;
            vertical-align: middle;
            text-align: left;
            width: 98%;
        }

        .input {
            width: 350px;
        }

        .main-breadcrumb {
            height: 0px;
            line-height: 0px;
        }

        .highlight {
            color: red;
        }

        .turn-left {
            width: 500px;
            text-align: right;
        }

        .divcss5-b {
            overflow-y: scroll;
            overflow-x: scroll;
            height: 300px;
            width: 300px;
            position: absolute;
            margin-top: 45px
        }

        .divcss6-b {
            margin-left: 0px;
            overflow-y: scroll;
            overflow-x: hidden;
            height: 300px;
            width: 330px;
            position: absolute;
            margin-top: 45px;
        }

        .divcss7-b {
            margin-left: 350px;
            overflow-y: scroll;
            overflow-x: hidden;
            height: 300px;
            width: 450px;
            position: absolute;
            margin-top: 45px;
        }

    </style>
</head>
<body>

<th:block layout:fragment="custom_content">

    <el-dialog
            title="项目信息"
            :visible.sync="showItemDialogVisible"
            size="tiny"
            width="1000px" id="addDialog">

        <el-form :model="addForm" ref="addForm" id="addForm" style="z-index: 99;background-color: white">

            <table>
                <tr>
                    <td class="turn-left">开始时间：</td>
                    <td>{{addForm.startTimeShow}}</td>
                </tr>
                <tr>
                    <td class="turn-left">结束时间：</td>
                    <td>{{addForm.endTimeShow}}</td>
                </tr>
                <tr>
                    <td class="turn-left">参加人员：</td>
                    <td>
                        <el-table :data="tableData" v-loading.body="loading" border stripe>
                            <el-table-column prop="name" label="姓名" width="100px"></el-table-column>
                            <el-table-column prop="deptname" label="部门" width="200px"></el-table-column>
                            <el-table-column prop="phone" label="联系方式" width="150px"></el-table-column>
                            <el-table-column prop="email" label="邮件" width="300px"></el-table-column>
                        </el-table>
                        <el-pagination
                                @current-change="handleCurrentChange"
                                :current-page.sync="pageNum"
                                :page-size="pageSize"
                                :page-sizes="pageSizesList"
                                layout="total, sizes,prev, pager, next"
                                :total="total">
                        </el-pagination>
                    </td>
                </tr>
            </table>
        </el-form>
        <div slot="footer" class="dialog-footer" style="text-align:center">
            <el-button type="primary" size="mini" @click="handleAddClose">关 闭</el-button>
        </div>
    </el-dialog>

    <el-dialog
            title="添加项目信息"
            :visible.sync="addItemDialogVisible"
            size="tiny"
            width="1000px" id="addDialog">
        <div>


            <span style="margin-left: 23px;">开始日期：</span>
            <el-date-picker
                    value-format="yyyy-MM-dd"
                    style="margin-top: 10px;width:205px;"
                    v-model="updateItemForm.startTime"
                    type="date"
                    placeholder="开始日期">
            </el-date-picker>
        </div>
        <div style="width: 50%;float:left;">
            <span style="margin-left: 23px;">结束日期：</span>
            <el-date-picker
                    value-format="yyyy-MM-dd"
                    style="margin-top: 10px;width:205px;"
                    v-model="updateItemForm.endTime"
                    type="date"
                    placeholder="结束日期">
            </el-date-picker>
        </div>

        <!--<div  style="width: 60%;">-->
        <!--<span style="margin-left: 23px;">会议说明：</span>-->
        <!--<el-input  size="small" v-model="addForm.conferenceNotes"  style="width:205px;margin-top: 15px" ></el-input>-->
        <!--<span style="margin-left: 23px;">会议说明：</span>-->
        <!--<el-input  size="small" v-model="addForm.conferenceNotes"  style="width:205px;margin-top: 15px" ></el-input>-->
        <!--</div>-->

        <el-table :data="dataempty" stripe style="width:100%;height:0px;">

        </el-table>

        <!--<el-col :span="4" style="margin-top: 10px"><div style="background-color: #FFE4E1;height:40px;line-height:40px;font-weight:bold;text-align: center;line-height:40px" >会议成员</div></el-col><br>-->
        <!--<el-table :data="dataempty"  stripe style="width:100%;height:0px"></el-table>-->
        <!--<el-col :span="5"><div style="width:300px;background-color:#FFE4E1;height:60px;line-height:40px;font-weight:bold;" >部门</div></el-col>-->
        <!--<el-col :span="5" ><div style="float:left;margin-left: 48px;width:300px;background-color:#FFE4E1;height:60px;line-height:40px;font-weight:bold;" >人员</div></el-col>-->

        <span style="width: 315px;margin-top: 10px;float:left;background-color: #FFE4E1;position: absolute;height:40px;text-align: center;line-height:40px;z-index: 100"><span>可选择人员</span>
    </span>
        <span style="width: 455px;float:left;margin-top: 10px;margin-left:330px;background-color: #FFE4E1;position: absolute;height:40px;text-align: center;line-height:40px;z-index: 100"><span>已选择人员</span>
    </span>

        <div class="divcss6-b">
            <el-table :data="tableData" v-loading.body="loading" stripe
                      style="width: 300px;text-align: center;line-height:15px;">
                <el-table-column prop="name" label="姓名" width="150" align="center"></el-table-column>
                <el-table-column prop="" label="添加" width="150" align="center">
                    <template slot-scope="scope">
                        <!--<img src="/images/add.png"  @click="adduser" width="20px" height="20px"> </a>-->
                        <img src="/images/add.png" @click="adduser(scope.row.deptname,scope.row.id,scope.row.name)"
                             width="20px" height="20px">
                    </template>

                </el-table-column>
            </el-table>

        </div>

        <div class="divcss7-b" style="text-align: center;line-height:15px;">

            <el-table :data="attendusers" style="width: 270px;text-align: center;line-height:15px;">
                <!--<el-table-column prop="deptname" label="部门" width="130" align="center"></el-table-column>-->
                <el-table-column prop="name" label="姓名" width="170" align="center"></el-table-column>
                <el-table-column label="删除" width="100" align="center">
                    <template slot-scope="scope">
                        <img src="/images/min.png" @click="minuser(scope.row.userid)" width="20px" height="20px">
                    </template>
                </el-table-column>
            </el-table>

            <br>

        </div>
        <div style="width: 100%;text-align: center;margin-top:345px;">

            <el-button type="primary" size="mini" @click="handleAddSave('updateItemForm')">添 加</el-button>
            <el-button type="primary" size="mini" @click="addItemDialogVisible = false">取 消</el-button>
        </div>
    </el-dialog>

    <el-dialog
            title="编辑项目信息"
            :visible.sync="updateItemDialogVisible"
            size="tiny"
            width="1000px"
            id="updateDialog">
        <div>


            <span style="margin-left: 23px;">开始日期：</span>
            <el-date-picker
                    value-format="yyyy-MM-dd"
                    style="margin-top: 10px;width:205px;"
                    v-model="updateItemForm.startTime"
                    type="date"
                    placeholder="开始日期">
            </el-date-picker>
        </div>
        <div style="width: 50%;float:left;">
            <span style="margin-left: 23px;">结束日期：</span>
            <el-date-picker
                    value-format="yyyy-MM-dd"
                    style="margin-top: 10px;width:205px;"
                    v-model="updateItemForm.endTime"
                    type="date"
                    placeholder="结束日期">
            </el-date-picker>
        </div>

        <!--<div  style="width: 60%;">-->
        <!--<span style="margin-left: 23px;">会议说明：</span>-->
        <!--<el-input  size="small" v-model="addForm.conferenceNotes"  style="width:205px;margin-top: 15px" ></el-input>-->
        <!--<span style="margin-left: 23px;">会议说明：</span>-->
        <!--<el-input  size="small" v-model="addForm.conferenceNotes"  style="width:205px;margin-top: 15px" ></el-input>-->
        <!--</div>-->

        <el-table :data="dataempty" stripe style="width:100%;height:0px;">

        </el-table>

        <!--<el-col :span="4" style="margin-top: 10px"><div style="background-color: #FFE4E1;height:40px;line-height:40px;font-weight:bold;text-align: center;line-height:40px" >会议成员</div></el-col><br>-->
        <!--<el-table :data="dataempty"  stripe style="width:100%;height:0px"></el-table>-->
        <!--<el-col :span="5"><div style="width:300px;background-color:#FFE4E1;height:60px;line-height:40px;font-weight:bold;" >部门</div></el-col>-->
        <!--<el-col :span="5" ><div style="float:left;margin-left: 48px;width:300px;background-color:#FFE4E1;height:60px;line-height:40px;font-weight:bold;" >人员</div></el-col>-->

        <span style="width: 315px;margin-top: 10px;float:left;background-color: #FFE4E1;position: absolute;height:40px;text-align: center;line-height:40px;z-index: 100"><span>可选择人员</span>
    </span>
        <span style="width: 455px;float:left;margin-top: 10px;margin-left:330px;background-color: #FFE4E1;position: absolute;height:40px;text-align: center;line-height:40px;z-index: 100"><span>已选择人员</span>
    </span>

        <div class="divcss6-b">
            <el-table :data="tableData" v-loading.body="loading" stripe
                      style="width: 300px;text-align: center;line-height:15px;">
                <el-table-column prop="name" label="姓名" width="150" align="center"></el-table-column>
                <el-table-column prop="" label="添加" width="150" align="center">
                    <template slot-scope="scope">
                        <!--<img src="/images/add.png"  @click="adduser" width="20px" height="20px"> </a>-->
                        <img src="/images/add.png" @click="adduser(scope.row.deptname,scope.row.id,scope.row.name)"
                             width="20px" height="20px">
                    </template>

                </el-table-column>
            </el-table>

        </div>

        <div class="divcss7-b" style="text-align: center;line-height:15px;">

            <el-table :data="attendusers" style="width: 270px;text-align: center;line-height:15px;">
                <!--<el-table-column prop="deptname" label="部门" width="130" align="center"></el-table-column>-->
                <el-table-column prop="name" label="姓名" width="170" align="center"></el-table-column>
                <el-table-column label="删除" width="100" align="center">
                    <template slot-scope="scope">
                        <img src="/images/min.png" @click="minuser(scope.row.userid)" width="20px" height="20px">
                    </template>
                </el-table-column>
            </el-table>

            <br>

        </div>
        <div style="width: 100%;text-align: center;margin-top:345px;">

            <el-button type="primary" size="mini" @click="handleUpdSave('updateItemForm')">更 新</el-button>
            <el-button type="primary" size="mini" @click="updateItemDialogVisible = false">取 消</el-button>
        </div>
    </el-dialog>

    <el-dialog
            title="删除提示"
            :visible.sync="delDialogVisible"
            size="tiny">
        <span>确定删除该文件？</span>
        <span slot="footer" class="dialog-footer">
                <el-button @click="delDialogVisible = false">取 消</el-button>
                <el-button type="primary" @click="handleDelConfirm">确 定</el-button>
            </span>
    </el-dialog>

    <br>
    文件名：<label id="title" style="margin-top: 3px;margin-bottom: 3px;padding:5px"></label>&nbsp;&nbsp; <br>
    <!--所在目录：<label id="catalog"></label>-->
    <el-form ref="form" :model="form" class="search-form" style="margin-top: 5px;margin-bottom:5px">
        <el-button type="primary" size="mini" @click="showItem">项目信息</el-button>
        <el-button type="primary" size="mini" shiro:hasRole="管理员" style="margin-left:20px" @click="toUpdateRule">修改
        </el-button>
        <el-button type="primary" size="mini" shiro:hasRole="管理员" @click="handleDel">删除</el-button>
        <el-button type="primary" size="mini" shiro:hasRole="管理员" @click="updateItem">添加/修改项目信息</el-button>
        <el-button type="primary" size="mini" shiro:hasRole="管理员" @click="toRuleHis">查看历史记录</el-button>
        <el-button type="primary" size="mini" shiro:hasRole="管理员" @click="toRuleWatch">文件浏览记录</el-button>
        <el-button type="primary" size="mini" shiro:hasRole="管理员" @click="toSchedule">项目进度</el-button>

    </el-form>

    <!--<el-form ref="form" :model="form" class="info-form"  shiro:hasRole="管理员">-->
    <!--<el-button type="primary" size="mini" shiro:hasRole="管理员" style="margin-left:20px" @click="toUpdateRule">预览</el-button>-->
    <!--<el-button type="primary" size="mini" shiro:hasRole="管理员" style="margin-left:20px" @click="toUpdateRule">修改</el-button>-->
    <!--<el-button type="primary" size="mini" shiro:hasRole="管理员" @click="handleDel">删除</el-button>-->
    <!--<el-button type="primary" size="mini" shiro:hasRole="管理员" @click="toRuleHis">查看历史记录</el-button>-->
    <!--<el-button type="primary" size="mini" shiro:hasRole="管理员" @click="toRuleWatch">文件浏览记录</el-button>-->
    <!--<el-button type="primary" size="mini" shiro:hasRole="管理员" @click="toRuleWatch">上传附件</el-button>-->

    <!--</el-form>-->
    <!--<el-form ref="form" :model="form" class="info-form"  shiro:hasRole="管理员">-->
    <!--&lt;!&ndash;<el-input v-model="keyword" id="keyword" size="mini" class="input"></el-input>&ndash;&gt;-->
    <!--&lt;!&ndash;<el-button type="primary" size="mini" class="searchnow">搜索</el-button>&ndash;&gt;-->
    <!--<el-button type="primary" size="mini" @click="showItem">项目信息</el-button>-->
    <!--<el-button type="primary" size="mini" shiro:hasRole="管理员" @click="updateItem">添加/修改项目信息</el-button>-->

    <!--</el-form>-->
    <div id="content"
         style="background-color: #ffffff; width: 45%;padding:10px;float:left;word-wrap:break-word; overflow-x:scroll;max-height:600px;overflow-y: scroll">
    </div>

    <el-button style="float: right; padding: 3px 0;margin-right:3px;display:none" type="text" @click="hide()" id="zhedie">隐藏
    </el-button>
    <el-button style="float: right; padding: 3px 0;margin-right:3px;" type="text" @click="show()"
               id="zhankai">显示
    </el-button>
    <div id="filelist" style="background-color: #ffffff; width: 50%;padding:10px;float:left;margin-left:10px;display: none">
        相关文件： <!-- 上传附件 -->
        <!--<el-form-item>-->
        <input id="excelFileExtra" type="file" name="excelFileExtra" style="display:none"
               onchange="excelFileExtraChange(this.files)"/>
        <el-button size="mini" type="primary" @click="selectExcelFileExtra" class="loginBtn">选择附件</el-button>
        <!--</el-form-item>-->

        <!--附件列表-->
        <el-table :data="extraFiles">
            <el-table-column prop="fileName" label="文件名" width="220">
                <template slot-scope="scope">
                    <a :href="scope.row.downloadAddress">{{scope.row.fileName}} </a>
                </template>
                <!--<template slot-scope="scope">-->
                <!--<a :href="http://www.baidu.com">{scope.row.fileName}}</a>-->
                <!--</template>-->


            </el-table-column>

            <el-table-column prop="updateTime" label="更新时间" width="160" :formatter="dateFormat"></el-table-column>
            <el-table-column prop="updator" label="更新人" width="80"></el-table-column>

            <el-table-column label="操作" width="150">
                <template slot-scope="scope">
                    <!--<el-button size="mini" type="danger" @click="delFile(scope.row.id)">修改</el-button>-->
                    <input id="excelFileExtraUpd" type="file" name="excelFileExtraUpd" style="display:none"
                           v-on:change="excelFileExtraChangeUpd(this.files,scope.row.id)"/>
                    <el-button size="mini" type="primary" @click="selectExcelFileExtraUpd" class="loginBtn">修改
                    </el-button>

                    <el-button size="mini" type="danger" @click="delFile(scope.row.id)">删除</el-button>


                    <input id="excelFileExtraPostil" type="file" name="excelFileExtraUpd" style="display:none"
                           v-on:change="excelFileExtraChangePostil(this.files,scope.row.id)"/>
                    <el-button size="mini" type="primary" @click="selectExcelFileExtraPostil" class="loginBtn">修订
                    </el-button>
                    <!--<el-button size="mini" type="primary"   @click="showpostil(scope.row.id)"  class="loginBtn">修订</el-button>-->
                </template>
            </el-table-column>
        </el-table>
    </div>
</th:block>
<th:block layout:fragment="javascript">
    <script th:src="@{/moment.js}"></script>

    <script>
        var indexVue = new Vue({
            el: '#app',
            data: function () {
                return {
                    showItemDialogVisible: false,
                    siderWidthDialog: false,
                    addItemDialogVisible: false,
                    updateItemDialogVisible: false,
                    siderbarWidth: 15,
                    keyword: '',
                    extraFiles: [],
                    id: '',
                    form: {
                        title: '',
                        content: ''
                    },
                    attendusers: [],
                    tableData: [],
                    pageNum: 0,
                    total: 0,
                    pageSize: 5,
                    pageSizesList: [5],
                    loading: false,
                    dataempty: [],
                    breadcrumbs: [''],
                    updateItemForm: {
                        id: '',
                        startTime: '',
                        endTime: '',
                        attendUser: []
                    },
                    addForm: {
                        title: '',
                        area: '',
                        address: ''
                    },
                    updateFlg: '',
                    delDialogVisible: false,
                    isCollapse: false,
                    defaultIndex: '1',
                    menus: [],
                    regulationMenus: [],
                    deptTrees: []

                }
            },
            methods: {
                hide: function (id) {
                    $("#filelist").css("display", "none");
                    $("#zhankai").show();
                    $("#zhedie").hide();
                    $("#content").css("width", "95%");
                },
                show: function (id) {
                    $("#filelist").show();
                    $("#zhankai").hide();
                    $("#zhedie").show();
                    $("#content").css("width", "45%");
                },
                adduser: function (deptname, userid, name) {
                    var $this = this;
                    var item = {
                        // deptid:1,
                        deptname: deptname,
                        userid: userid,
                        name: name
                    };

                    for (var i = 0; i < indexVue.attendusers.length; i++) {
                        if (indexVue.attendusers[i]['name'] == name) {
                            $this.$alert('该人员已在参与队列！', '提示', {
                                confirmButtonText: '确定',
                                callback: function callback() {

                                }
                            });
                            return;
                        }
                    }

                    indexVue.attendusers.unshift(item);
                },
                minuser: function (id) {
                    for (var i = 0; i < indexVue.attendusers.length; i++) {
                        var userid = indexVue.attendusers[i]['userid'];
                        if (userid == id) {
                            indexVue.attendusers.splice(i, 1);
                        }
                    }
                },
                showpostil: function (id) {
                    location.href = "/regulation/showpostil/" + indexVue.id;
                },
                delFile: function (id) {
                    var formData = new FormData();

                    formData.append('oldId', id);

                    $.ajax({
                        url: '/regulation/delFile',
                        type: 'POST',
                        cache: false,
                        data: formData,
                        processData: false,
                        contentType: false
                    }).done(function (res) {

                        location.reload();
                        indexVue.addHeight();
                    }).fail(function (res) {
                        indexVue.$alert('上传附件失败！', '提示', {
                            confirmButtonText: '确定',
                            callback: function callback() {

                            }
                        });
                    });
                    // for (var i = 0; i < indexVue.extraFiles.length; i++) {
                    //     var fileId = indexVue.extraFiles[i]['id'];
                    //     if (fileId == id) {
                    //         indexVue.extraFiles.splice(i, 1);
                    //     }
                    // }
                },
                handleCurrentChange: function (val, size) {
                    searchAttendUsers('${val}');
                },
                handleAddClose: function () {
                    indexVue.showItemDialogVisible = false;
                },
                //时间格式化
                dateFormat: function (row, column) {
                    var date = row[column.property];
                    if (date == undefined) {
                        return "";
                    }
                    return moment(date).format("YYYY-MM-DD HH:mm:ss");
                },
                showItem: function () {

                    var condition = {};
                    var fileId = indexVue.id;
                    condition['fileId'] = fileId;

                    $.ajax({
                        cache: true,
                        url: '/regulation/showupditem?newDate=' + Math.random(),
                        type: 'POST',
                        data: JSON.stringify(condition),
                        dataType: 'json',
                        contentType: 'application/json',
                        async: false,
                        success: function (data) {

                            indexVue.showItemDialogVisible = true;
                            var detail = data.value.rule;
                            indexVue.addForm = detail;
                            // var attendusersList = detail.attendusersList;
                            // for (var i = 0; i < attendusersList.length; i++) {
                            //     var item = attendusersList[i];
                            //     indexVue.attendusers.unshift(item);
                            // }
                            searchAttendUsers(1);
                        }
                    });
                },
                toUpdateRule: function () {
                    location.href = "/regulation/editregulation/" + indexVue.id;
                },
                handleAddSave: function (formName) {
                    var $this = this;

                    if (indexVue.updateItemForm.startTime == undefined || indexVue.updateItemForm.startTime == '') {
                        $this.$alert('请选择开始日期！', '提示', {
                            confirmButtonText: '确定',
                            callback: function callback() {

                            }
                        });
                        return;
                    }
                    if (indexVue.updateItemForm.endTime == undefined || indexVue.updateItemForm.endTime == '') {
                        $this.$alert('请选择结束日期！', '提示', {
                            confirmButtonText: '确定',
                            callback: function callback() {

                            }
                        });
                        return;
                    }

                    var attendusers = ",";
                    for (var i = 0; i < indexVue.attendusers.length; i++) {
                        attendusers += indexVue.attendusers[i]['userid'] + ",";
                    }
                    if (attendusers != ",") {
                        indexVue.updateItemForm.attendUser = attendusers;
                    } else {
                        indexVue.updateItemForm.attendUser = '';
                    }

                    indexVue.updateItemForm.id = indexVue.id;
                    var $this = this;
                    $.ajax({
                        cache: false,
                        url: '/regulation/addAttendInfo',
                        type: 'POST',
                        data: JSON.stringify(indexVue.updateItemForm),
                        dataType: 'json',
                        contentType: 'application/json',
                        async: false,
                        success: function (data) {
                            if (data.status == 1) {
                                $this.$alert('项目信息添加成功！', '提示', {
                                    confirmButtonText: '确定',
                                    callback: function callback() {
                                        indexVue.addItemDialogVisible = false;
                                    }
                                });


                            } else {
                                $this.$message.error(data.msg);
                            }

                            indexVue.addHeight();
                        }
                    });
                },
                handleUpdSave: function (formName) {
                    var $this = this;

                    if (indexVue.updateItemForm.startTime == undefined || indexVue.updateItemForm.startTime == '') {
                        $this.$alert('请选择开始日期！', '提示', {
                            confirmButtonText: '确定',
                            callback: function callback() {

                            }
                        });
                        return;
                    }
                    if (indexVue.updateItemForm.endTime == undefined || indexVue.updateItemForm.endTime == '') {
                        $this.$alert('请选择结束日期！', '提示', {
                            confirmButtonText: '确定',
                            callback: function callback() {

                            }
                        });
                        return;
                    }

                    var attendusers = ",";
                    for (var i = 0; i < indexVue.attendusers.length; i++) {
                        attendusers += indexVue.attendusers[i]['userid'] + ",";
                    }
                    if (attendusers != ",") {
                        indexVue.updateItemForm.attendUser = attendusers;
                    } else {
                        indexVue.updateItemForm.attendUser = '';
                    }

                    indexVue.updateItemForm.id = indexVue.id;
                    var $this = this;
                    $.ajax({
                        cache: false,
                        url: '/regulation/addAttendInfo?newDate=' + Math.random(),
                        type: 'POST',
                        data: JSON.stringify(indexVue.updateItemForm),
                        dataType: 'json',
                        contentType: 'application/json',
                        async: false,
                        success: function (data) {
                            if (data.status == 1) {
                                $this.$alert('项目信息更新成功！', '提示', {
                                    confirmButtonText: '确定',
                                    callback: function callback() {
                                        indexVue.updateItemDialogVisible = false;
                                    }
                                });


                            } else {
                                $this.$message.error(data.msg);
                            }

                            indexVue.addHeight();
                        }
                    });
                },
                addHeight: function () {
                    var $this = this;
                    $this.$nextTick(function () {
                        changeFooterHeight();
                    })
                },
                selectExcelFileExtra: function () {
                    $('#excelFileExtra').click();
                },

                selectExcelFileExtraUpd: function () {

                    $('#excelFileExtraUpd').click();
                },
                selectExcelFileExtraPostil: function () {

                    $('#excelFileExtraPostil').click();
                },
                handleDel: function () {
                    indexVue.delDialogVisible = true;
                },
                updateItem: function () {

                    indexVue.attendusers = [];
                    var condition = {};
                    var fileId = indexVue.id;
                    condition['fileId'] = fileId;

                    $.ajax({
                        cache: true,
                        url: '/regulation/showupditem?newDate=' + Math.random(),
                        type: 'POST',
                        data: JSON.stringify(condition),
                        dataType: 'json',
                        contentType: 'application/json',
                        async: false,
                        success: function (data) {

                            var flag = data.value.flag;
                            if (flag == 1) {
                                indexVue.addItemDialogVisible = true;
                            } else {
                                indexVue.updateItemDialogVisible = true;
                                var detail = data.value.rule;
                                indexVue.updateItemForm = detail;
                                var attendusersList = detail.attendusersList;
                                for (var i = 0; i < attendusersList.length; i++) {
                                    var item = attendusersList[i];
                                    indexVue.attendusers.unshift(item);
                                }
                            }
                        }
                    });

                    condition = {};
                    $.ajax({
                        cache: true,
                        url: '/user/listall',
                        type: 'POST',
                        data: JSON.stringify(condition, "\t"),
                        dataType: 'json',
                        contentType: 'application/json',
                        async: false,
                        success: function (data) {

                            indexVue.tableData = data.value;

                        }
                    });
                },
                handleDelConfirm: function () {
                    indexVue.delDialogVisible = false;
                    var data = new Object();
                    data.id = indexVue.id;

                    $.ajax({
                        cache: true,
                        url: '/regulation/deleterule',
                        type: 'POST',
                        data: JSON.stringify(data, "\t"),
                        dataType: 'json',
                        contentType: 'application/json',
                        async: false,
                        success: function (data) {
                            if (data.status == 1) {
                                location.href = "/regulation/search/";
                            }
                        }
                    });

                },
                excelFileExtraChangeUpd: function (files, oldId) {
                    var formData = new FormData();
                    if ($('#excelFileExtraUpd')[0].files[0] == undefined) {
                        return;
                    }
                    formData.append('excelFileExtraUpd', $('#excelFileExtraUpd')[0].files[0]);
                    var id = indexVue.id;
                    formData.append('fileId', id);
                    formData.append('oldId', oldId);
                    $.ajax({
                        url: '/regulation/updatefile',
                        type: 'POST',
                        cache: false,
                        data: formData,
                        processData: false,
                        contentType: false
                    }).done(function (res) {

                        var item = {
                            fileId: res.value.id,
                            fileName: res.value.fileName,
                            fileUrl: res.value.fileUrl
                        };
                        location.reload();
                        // location.href = "/accessfilelog/" + indexVue.id;
                        // indexVue.extraFiles.unshift(item);
                        indexVue.addHeight();
                    }).fail(function (res) {
                        indexVue.$alert('上传附件失败！', '提示', {
                            confirmButtonText: '确定',
                            callback: function callback() {

                            }
                        });
                    });

                },

                excelFileExtraChangePostil: function (files, oldId) {
                    var formData = new FormData();
                    if ($('#excelFileExtraPostil')[0].files[0] == undefined) {
                        return;
                    }
                    formData.append('excelFileExtraPostil', $('#excelFileExtraPostil')[0].files[0]);
                    var id = indexVue.id;
                    formData.append('fileId', id);
                    formData.append('oldId', oldId);
                    $.ajax({
                        url: '/regulation/updatefile',
                        type: 'POST',
                        cache: false,
                        data: formData,
                        processData: false,
                        contentType: false
                    }).done(function (res) {

                        var item = {
                            fileId: res.value.id,
                            fileName: res.value.fileName,
                            fileUrl: res.value.fileUrl
                        };
                        location.reload();
                        // location.href = "/accessfilelog/" + indexVue.id;
                        // indexVue.extraFiles.unshift(item);
                        indexVue.addHeight();
                    }).fail(function (res) {
                        indexVue.$alert('上传附件失败！', '提示', {
                            confirmButtonText: '确定',
                            callback: function callback() {

                            }
                        });
                    });

                },
                toRuleHis: function () {
                    location.href = "/regulation/listversion/" + indexVue.id;
                },
                toRuleWatch: function () {
                    location.href = "/accessfilelog/" + indexVue.id;
                },
                toSchedule: function () {
                    location.href = "/regulation/schedule/" + indexVue.id;
                },
                goback: function () {
                    history.go(-1);
                },
                search: function () {
                    highlight();
                },
                initMenu: function () {
                    var $this = this;
                    var data = commonInitMenu($this);

                },
                toggleMenu: function () {
                    this.isCollapse = !this.isCollapse;
                    window.localStorage.setItem('isCollapse', this.isCollapse);
                },
                changeSiderWidth: function (value) {
                    changeSiderWidth(this, value);
                },
                openChangeSiderWidth: function () {
                    this.siderWidthDialog = true;
                }
            },
            created: function () {
                initCssProperty(this);
            }
        });

        function searchAttendUsers(pageNum) {
            var condition = {pageNum: indexVue.pageNum};
            condition['id'] = indexVue.id;
            indexVue.loading = true;
            $.ajax({
                cache: true,
                url: '/regulation/searchAttendUsers?newDate=' + Math.random(),
                type: 'POST',
                data: JSON.stringify(condition),
                dataType: 'json',
                contentType: 'application/json',
                async: false,
                success: function (data) {
                    indexVue.loading = false;
                    if (data.status == 1) {
                        var pageInfo = data.value;
                        indexVue.tableData = pageInfo.list;
                        indexVue.pageNum = pageInfo.pageNum;
                        indexVue.total = pageInfo.total;
                        indexVue.addHeight();
                    }
                }
            });

        }

        function excelFileExtraChange(files) {
            var formData = new FormData();
            if ($('#excelFileExtra')[0].files[0] == undefined) {
                return;
            }
            formData.append('excelFileExtra', $('#excelFileExtra')[0].files[0]);
            var id = indexVue.id;
            formData.append('fileId', id);

            $.ajax({
                url: '/regulation/saveNewfile',
                type: 'POST',
                cache: false,
                data: formData,
                processData: false,
                contentType: false
            }).done(function (res) {

                var item = {
                    fileId: res.value.id,
                    fileName: res.value.fileName,
                    fileUrl: res.value.fileUrl
                };

                indexVue.extraFiles.unshift(item);
                indexVue.addHeight();
            }).fail(function (res) {
                indexVue.$alert('上传附件失败！', '提示', {
                    confirmButtonText: '确定',
                    callback: function callback() {

                    }
                });
            });

        }

        function excelFileExtraChangeUpd(files, oldId) {
            var formData = new FormData();
            if ($('#excelFileExtraUpd')[0].files[0] == undefined) {
                return;
            }
            formData.append('excelFileExtraUpd', $('#excelFileExtraUpd')[0].files[0]);
            var id = indexVue.id;
            formData.append('fileId', id);
            formData.append('oldId', oldId);
            $.ajax({
                url: '/regulation/updatefile',
                type: 'POST',
                cache: false,
                data: formData,
                processData: false,
                contentType: false
            }).done(function (res) {

                var item = {
                    fileId: res.value.id,
                    fileName: res.value.fileName,
                    fileUrl: res.value.fileUrl
                };
                location.reload();
                // location.href = "/accessfilelog/" + indexVue.id;
                // indexVue.extraFiles.unshift(item);
                indexVue.addHeight();
            }).fail(function (res) {
                indexVue.$alert('上传附件失败！', '提示', {
                    confirmButtonText: '确定',
                    callback: function callback() {

                    }
                });
            });

        }

        $(function () {
            $("#filelist").css("display", "none");
            $("#zhankai").show();
            $("#zhedie").hide();
            $("#content").css("width", "95%");


            indexVue.initMenu();
            var strs = location.href.split("/");
            var id = strs[strs.length - 1];
            indexVue.id = id;
            $.ajax({
                cache: true,
                url: '/regulation/showrule?newDate=' + Math.random(),
                type: 'GET',
                data: {ruleId: id},
                dataType: 'json',
                contentType: 'application/json',
                async: false,
                success: function (data) {

                    var ruleFilelists = data.value.ruleFilelists;
                    indexVue.extraFiles = ruleFilelists;

                    var b = new Base64();
                    var text = b.decode(data.value.rule.content);
                    $("#content").html(text);
                    $("#title").html(data.value.rule.title);
                    $("#catalog").html(data.value.rule.url);
                    $("#content p[style*='text-align:right']").css('text-align', 'justify');
                    $("#content p[style*='text-align: right']").css('text-align', 'justify');
                    $("#content").css("line-height", "17px");
                    indexVue.addHeight();

                    var hasrole = data.value.hasrole;
                    if (hasrole != "1") {

                        //禁用ctrl+c功能
                        document.onkeydown = function () {
                            if (event.ctrlKey && (window.event.keyCode == 67)) {

                                return false;
                            }

                            if (window.event.keyCode == 123) {
                                return false;
                            }
                        }

                        document.oncontextmenu = function () {
                            return false;
                        };
                    }
                }
            });

            changeFooterHeight();

            $('.searchnow').click(highlight);

            function highlight() {
                clearSelection();//先清空一下上次高亮显示的内容；
                var searchText = indexVue.keyword;//获取你输入的关键字；
                var regExp = new RegExp(searchText, 'g');//创建正则表达式，g表示全局的，如果不用g，则查找到第一个就不会继续向下查找了；

                if (!funcChina(searchText)) {
                    indexVue.$alert('请输入中文字搜索！', '提示', {
                        confirmButtonText: '确定',
                        callback: function callback() {

                        }
                    });
                    return;
                }
                var html = $("#content").html();
                var newHtml = html.replace(regExp, '<a class="highlight" >' + searchText + '</a>');//将找到的关键字替换，加上highlight属性；

                // var formatKeyword = searchText.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&') // 转义处理keyword包含的特殊字符，如 /.
                // var finder = new RegExp(">.*?" + searchText + ".*?<", 'g'); // 提取位于标签内的文本，避免误操作 class、id 等
                //
                // html = html.replace(finder, function (matched) {
                //     return matched.replace(searchText, "<a class=\"highlight\" >" + searchText + "</a>");
                // })

                $("#content").html(newHtml);
            }

            function clearSelection() {
                // var html = $("#content").html();
                $('.highlight').each(function ()//找到所有highlight属性的元素；
                {
                    $(this).replaceWith($(this).html());//将他们的属性去掉；
                });
            }

        })

        function funcChina(searchText) {
            if (/.*[\u4e00-\u9fa5]+.*$/.test(searchText)) {
                return true;
            } else {
                return false;
            }

        }

        function getContent() {
            return editor.txt.html();
        }

        //解析转义后的富文本标签
        function HTMLDecode(text) {
            var temp = document.createElement("div");
            temp.innerHTML = text;
            var output = temp.innerText || temp.textContent;
            temp = null;
            return output;
        }

        function Base64() {

            // private property
            _keyStr = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";

            // public method for encoding
            this.encode = function (input) {
                var output = "";
                var chr1, chr2, chr3, enc1, enc2, enc3, enc4;
                var i = 0;
                input = _utf8_encode(input);
                while (i < input.length) {
                    chr1 = input.charCodeAt(i++);
                    chr2 = input.charCodeAt(i++);
                    chr3 = input.charCodeAt(i++);
                    enc1 = chr1 >> 2;
                    enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
                    enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
                    enc4 = chr3 & 63;
                    if (isNaN(chr2)) {
                        enc3 = enc4 = 64;
                    } else if (isNaN(chr3)) {
                        enc4 = 64;
                    }
                    output = output +
                        _keyStr.charAt(enc1) + _keyStr.charAt(enc2) +
                        _keyStr.charAt(enc3) + _keyStr.charAt(enc4);
                }
                return output;
            }

            // public method for decoding
            this.decode = function (input) {
                var output = "";
                var chr1, chr2, chr3;
                var enc1, enc2, enc3, enc4;
                var i = 0;
                input = input.replace(/[^A-Za-z0-9\+\/\=]/g, "");
                while (i < input.length) {
                    enc1 = _keyStr.indexOf(input.charAt(i++));
                    enc2 = _keyStr.indexOf(input.charAt(i++));
                    enc3 = _keyStr.indexOf(input.charAt(i++));
                    enc4 = _keyStr.indexOf(input.charAt(i++));
                    chr1 = (enc1 << 2) | (enc2 >> 4);
                    chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);
                    chr3 = ((enc3 & 3) << 6) | enc4;
                    output = output + String.fromCharCode(chr1);
                    if (enc3 != 64) {
                        output = output + String.fromCharCode(chr2);
                    }
                    if (enc4 != 64) {
                        output = output + String.fromCharCode(chr3);
                    }
                }
                output = _utf8_decode(output);
                return output;
            }

            // private method for UTF-8 encoding
            _utf8_encode = function (string) {
                string = string.replace(/\r\n/g, "\n");
                var utftext = "";
                for (var n = 0; n < string.length; n++) {
                    var c = string.charCodeAt(n);
                    if (c < 128) {
                        utftext += String.fromCharCode(c);
                    } else if ((c > 127) && (c < 2048)) {
                        utftext += String.fromCharCode((c >> 6) | 192);
                        utftext += String.fromCharCode((c & 63) | 128);
                    } else {
                        utftext += String.fromCharCode((c >> 12) | 224);
                        utftext += String.fromCharCode(((c >> 6) & 63) | 128);
                        utftext += String.fromCharCode((c & 63) | 128);
                    }

                }
                return utftext;
            }

            // private method for UTF-8 decoding
            _utf8_decode = function (utftext) {
                var string = "";
                var i = 0;
                var c = c1 = c2 = 0;
                while (i < utftext.length) {
                    c = utftext.charCodeAt(i);
                    if (c < 128) {
                        string += String.fromCharCode(c);
                        i++;
                    } else if ((c > 191) && (c < 224)) {
                        c2 = utftext.charCodeAt(i + 1);
                        string += String.fromCharCode(((c & 31) << 6) | (c2 & 63));
                        i += 2;
                    } else {
                        c2 = utftext.charCodeAt(i + 1);
                        c3 = utftext.charCodeAt(i + 2);
                        string += String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63));
                        i += 3;
                    }
                }
                return string;
            }
        }

    </script>
</th:block>
</body>
</html>